<template>
    <div class="theme-content">
        <div class="theme-content-item">
            <div style="" ref='tablePagingFather'>
                <slot name="contentHeaderCustom"></slot>
                <tableHeader :pageInfo="tableItem.pageInfo" :operationItem="operationItem">
                    <template v-slot:customSearch>
                        <component :is="slots.customSearch" v-if="slots.customSearch"></component>
                    </template>
                    <template v-slot:customTableHeader>
                        <!-- <el-input v-model="input" placeholder="Please input" /> -->
                        <component :is="slots.customTableHeader" v-if="slots.customTableHeader"></component>
                    </template>
                </tableHeader>
            </div>
            <tableVue v-loading="props.tableItem.loading" :tableItem="tableItem">
                <template v-slot:footerCustom>
                    <component :is="slots.footerCustom" v-if="slots.footerCustom"></component>
                </template>
                <template v-slot:actionCustom="scope">
                    <component :is="slots.actionCustom" :scope="scope" v-if="slots.actionCustom"></component>
                </template>
            </tableVue>
        </div>
    </div>
</template>
<script setup>
import tableVue from './table'
import tableHeader from './table-header'
import {onMounted, ref, useSlots} from 'vue'
import {publicApi} from '@/api/public'

const tablePagingFather = ref('')
const input = ref('')
const slots = useSlots()
const props = defineProps({
    tableItem: { default: function () { return {} } },
    operationItem: { default: function () { return {} } },
})
onMounted(() => {
  console.log('初始化')
  props.operationItem.SearchItem.map((item) => {
    item.valueInit ? props.tableItem.pageInfo.request[item.code] = item.valueInit : ''
  })
  let tableItem = props.tableItem
  let pageInfo = tableItem.pageInfo
  let dataRequest  = pageInfo.request
  let pageDomain = dataRequest.pageDomain
  if (!pageDomain || Object.keys(pageDomain) == 0){
    dataRequest.pageDomain = {
      "pageNum": 1,//分页页面数
      "pageSize": 10,//分页页面数据大小
      "orderByColumn": "",//搜索参数
      "isAsc": "",//
      "reasonable": ""//
    }
  }
  if (pageInfo.url) {
    const url = pageInfo.url
    const method = pageInfo.method || 'POST'
    const request = pageInfo.request || {}

    pageInfo.paging = () => {
      console.log(url, method, request)
      tableItem.loading = true
      publicApi(url, method, request).then((res) => {
        if (res.rows) {
          tableItem.tableData.data = res.rows || [];
          tableItem.tableData.total = res.total || 0
        }
        if (res.data) {
          tableItem.tableData.data = res.data || [];
          tableItem.tableData.total = res.total || 0
        }
        tableItem.loading = false
        if (pageInfo.afterPaging){
          pageInfo.afterPaging(res)
        }

      }).catch(() => {
        tableItem.loading = false
      })
    }
  }
  if (pageInfo.closeMountedPaging) {
    return
  }
  pageInfo.paging()
})

</script>

<style></style>
